<template>
    <div class="container-check">
        <el-row class="wrap-search">
            姓名：
            <el-input v-model="configList.param.trueNameLike" placeholder="请输入"></el-input>
            状态：
            <el-select v-model="configList.param.auditStatus" placeholder="请选择">
                <el-option
                        v-for="item in options"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                </el-option>
            </el-select>
            <el-button  type="primary" size="medium" @click="getList">查询</el-button>
        </el-row>
        <div class="">
            <table-list ref="tableList" :tableConfig='configList'>
                <el-table-column  slot="image"  align="center" label="头像">
                    <template slot-scope="scope">
                        <img class="avatar-img"  :src="scope.row.images[0].fileUrl" alt="">
                    </template>
                </el-table-column>
                <el-table-column  slot="sex"  align="center" label="性别">
                    <template slot-scope="scope">
                        <div>{{scope.row.sex?'男':'女'}}</div>
                    </template>
                </el-table-column>
                <el-table-column  slot="duty"  align="center" label="认证身份">
                    <template slot-scope="scope">
                        <div>{{returnDotsArr(scope.row.duty)}}</div>
                    </template>
                </el-table-column>
                <el-table-column  slot="area"  align="center" label="地区">
                    <template slot-scope="scope">
                        <div>{{scope.row.province+scope.row.city+scope.row.district}}</div>
                    </template>
                </el-table-column>
                <el-table-column min-width="200px" slot="certificate"  align="center" label="资格证书">
                    <template slot-scope="scope">
                        <img class="check-pic" @click="imgClick(list.fileUrl)" v-if="list" v-for="(list,index) in scope.row.certs" :key="index"   :src="list.fileUrl" alt="">
                   </template>
                </el-table-column>
                <el-table-column  slot="status"  align="center" label="状态">
                    <template slot-scope="scope">
                        <div>{{statusArr[scope.row.auditStatus]}}</div>
                    </template>
                </el-table-column>
                <el-table-column min-width="130px" class="btn" label="操作" slot="btn" align="center" >
                    <template slot-scope="scope">
                        <el-button  @click="$router.push('/checkDetail?id='+scope.row.id)" size="mini" >查看</el-button>
                        <el-button v-if="scope.row.auditStatus == 'w'" type="primary" size="mini" @click="passBtn(scope.row.id,'pass')">通过</el-button>
                        <el-button v-if="scope.row.auditStatus == 'w'" size="mini" type="danger" @click="passBtn(scope.row.id)">不通过</el-button>
                    </template>
                </el-table-column>
            </table-list>
        </div>
        <el-dialog
                :visible.sync="dialogVisible"
                size="tiny"
        >
            <img class="dialog-pic" :src="imgUrl" alt="">
        </el-dialog>
    </div>
</template>

<script>
    let CONSTANT = require('../../constant/constant.js');
    let common = require("../../common.js");
    export default {
        data() {
            return {
                options: [{
                    value: '',
                    label: '全部'
                }, {
                    value: 'w',
                    label: '待审核'
                }, {
                    value: 'y',
                    label: '已通过'
                }, {
                    value: 'n',
                    label: '不通过'
                }],
                statusArr:{
                    'n':'不通过',
                    'y':'已通过',
                    'w':'待审核'
                },
                dotsArr:[
                    {key: "doctor", value: "医生"},
                    {key: "nurse", value: "护士"},
                    {key: "recover_physical_therapist", value: "康复理疗师"},
                    {key: "health_manager", value: "健康管理师"},
                    {key: "apothecary", value: "药师"},
                    {key: "hospital", value: "医院"},
                    {key: "clinic", value: "诊所"},
                    {key: "drugstore", value: "药店"},
                    {key: "medical_instrument_supplie", value: "医疗器械供应商"}
                ],
                value: '',
                doctorName: "",
                configList:{
                    url:CONSTANT.URL.DOCTOR.DOCTORCHECKLIST,
                    configList:[
                        {
                            slot:'image'
                        },
                        {
                            label:'姓名',
                            prop:'trueName'
                        },
                        {
                            slot: "sex"
                        },
                        {
                            slot: "duty"
                        },
                        {
                           slot:'area'
                        },
                        {
                            slot: "certificate"
                        },
                        {
                            slot:'status'
                        },
                        {
                            slot:'btn'
                        }
                    ],
                    param:{
                        // trueNameLike:'',
                        // auditStatus:''
                    },
                    type:'',
                    width:'',
                    isPagination:true
                },
                dialogVisible:false,
                dialogVisible1:false,
                imgUrl:'',
                upLoadUrl:'',
                dataList:[]
            }
        },
        components: {
            'table-list':() => import('../common/my-table')
        },
        mounted() {
        },
        methods: {
            getList(){
                this.$refs.tableList.getList()
            },
            imgClick(url){
                this.imgUrl = url;
                this.dialogVisible = true;
            },
            passBtn(id,state){
                let title = state=='pass'?'通过':'不通过'
                this.$confirm(`确认${title}?`, '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let  url = CONSTANT.URL.DOCTOR.CHANGEDOCTORSTATUS,
                        param = {id:id,auditStatus:state=='pass'?'y':'n'}
                    common.requestAjax(url,{},param,(res)=>{
                        if(res.status == 200){
                            this.$message({
                                type: 'success',
                                message:res.msg
                            });
                            this.getList();
                        }else{
                            this.$message({
                                message: res.msg,
                                type: 'warning'
                            });
                        }
                    })

                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            returnDotsArr(duty){
                if (duty) {
                    let dd = "";
                    this.dotsArr.map( item => {
                        if (item.key == duty) {
                            dd = item.value
                        }
                    })
                    return dd;
                } else {
                    return ""
                }
            },
            delLevel(id){
                this.$confirm('确定删除?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    let  url = CONSTANT.URL.ACTIVITY.DELETEACTIVITYINFO,
                        param = {id:id}
                    common.requestAjax(url,{},param,(res)=>{
                        if(res.status == 200){
                            this.$message({
                                type: 'success',
                                message:res.msg
                            });
                            this.getList();
                        }else{
                            this.$message({
                                message: res.msg,
                                type: 'warning'
                            });
                        }
                    })

                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            handleRemove(file, fileList) {      // 图片上传
                let deleteUrl = file.url;
                let list = this.information.images;
                list.forEach(function(item,index){
                    if(item.fileUrl == deleteUrl){
                        list.splice(index,1);
                    }
                })
                console.log(list);
                this.information.images = list;
            },
            handlePictureCardPreview(file) {
                this.dialogImageUrl = file.url;
                this.dialogVisible = true;
            },
            handleFileSuccess(res, file) {
                if(res.status == 200){
                    let picItem = res.data.bussData;
                    this.information.images.push(picItem);
                    this.fileListChange();
                }
            },
        }
    }
</script>

<style lang="scss">
    .container-check {
        .wrap-search {
            margin-bottom: 20px;
            .el-input {
                width: 20%;
            }
            .el-select {
                width: 20%;
                .el-input {
                    width: 100%;
                }
            }
        }
        .dialog-pic{
            width: 50%;
            margin: 0 auto;
            display: block;
        }
        .avatar-img{
            width: 60px;
            height: 60px;
            border-radius: 50%;
            -webkit-border-radius: 50%;
        }
        .check-pic{
            width: 80px;
            cursor: pointer;
            height: 40px;
            margin-right: 10px;
        }
        .cell{
            button{
                margin-top: 10px;
            }
        }
    }
</style>
